import Vue from 'vue'
import VueRouter from 'vue-router'
const LayOut = () => import('@/views/layout/index.vue')
const Login = () => import('@/views/login/index.vue')
const Home = () => import('@/views/home/home.vue')
// const goTO404 = () => import('@/views/404/index.vue')

// const Logins = () => import('@/views/zStudy/logins/index.vue')
// const GetWay = () => import('@/views/zStudy/getway/index.vue')
// const Father = () => import('@/views/zStudy/father/father.vue')
// const Select = () => import('@/views/zStudy/father/select/index.vue')



Vue.use(VueRouter)

// 首页作为基础页
export const baseRoute = [
  // 进入页面必须登录：每个页面都配 登录标识 太麻烦，直接给父级添加，设置路由拦截时- 通过 this.$route.matched 判断父级是否存在标识。
  {
    path:'/',
    component: LayOut,
    meta:{
      title:'首页',
      isLogin: true  // 是否需要登录
    },
    children:[
      {
        path: '/',
        name: 'home',
        component: Home,
        meta: {
            title: '首页'
        },
      },
    ]
  },
]
// 根 路由配置
export const routes = [
  {
    path:'/login',
    name:'login',
    component: Login
  },
  // {
  //   path: '*',
  //   component: goTO404,
  //   meta:{
  //     title:'404页',
  //     isLogin: true  // 是否需要登录
  //   }
  // }
]

/*
  1. 为解决next('/login')时会报错的bug！
  2：目的：重写VueRouter原型对象上的push方法, 覆盖原来抛出异常的方法, "吞掉"异常
  3: 注意：一定要在router创建实例之前
*/
const originalPush = VueRouter.prototype.push
VueRouter.prototype.push = function push(location, resolve, reject) {
  if (resolve || reject) return originalPush.call(this, location, resolve, reject)
  return originalPush.call(this, location).catch(() => { })
}

const router = new VueRouter({
  mode: 'history',
  routes
})
// 下面两行代码处理Bug ：产品列表页面，面包屑组件点击‘产品管理’时，重定向到自身路由时报错。
const VueRouterPush = VueRouter.prototype.push
VueRouter.prototype.push = function push (to) {
  return VueRouterPush.call(this, to).catch(err => err)
}

// 路由全局导航守卫,没登录不给进 , 抽取出去了 beforeEach.js-------------------------------------

export default router


/** 以下都是学习-资料 **/ 
// const routes = [
//   {
//     path: '/',
//     redirect: '/getway'
//   },
//   {
//     path: '/home',
//     name: 'layOutView',
//     component: layOutView,
//     children:[{
//       path:'',
//       component:Select
//     }]
//   },
//   {
//     path: '/logins',
//     name: 'logins',
//     alias: '/loginsAlias',
//     component: Logins
//   },
//   {
//     path: '/getway',
//     name: 'getway',
//     component: GetWay,
//     meta:{roles:'admin'}
//   },
//   {
//     path: '/father/:id',
//     name: 'father',
//     component: Father,
//     props: true,
//     children: [{
//       path: '',
//       component: Select,
//     },
//     {
//       path: 'Select',
//       name: 'Select',
//       component: Select,
//       meta: { needLogin: true }
//     }
//     ]
//   },
//   {
//     path: '*',
//     component: goTO404
//   }
// ]

/*
  1. 为解决next('/login')时会报错的bug！
  2：目的：重写VueRouter原型对象上的push方法, 覆盖原来抛出异常的方法, "吞掉"异常
  3: 注意：一定要在router创建实例之前
*/
// const originalPush = VueRouter.prototype.push
// VueRouter.prototype.push = function push(location, resolve, reject) {
//   if (resolve || reject) return originalPush.call(this, location, resolve, reject)
//   return originalPush.call(this, location).catch(() => { })
// }

// const router = new VueRouter({
//   mode: 'history',
//   base: process.env.BASE_URL,
//   routes,
  /*
    1.控制切换路由页面时，页面回到顶部或是保持原有位置。savedPosition 是对象，且只有在按下浏览器 后退/前进 按钮时才会返回来值，其他返回的都是null。
    2.默认切换路由页面时，都是回到页面顶部的。
    3. 如何保留浏览的位置呢？？？看下面
  */ 
//   scrollBehavior(to , from ,savedPosition){   
//     console.log('路由滚动',to ,from ,savedPosition);
//     if(savedPosition){
//       return savedPosition
//     }else {
//       return { x: 0 , y: 0}
//     }
//   }
// })

// router.beforeEach((to, from, next) => {
//   console.log(to, from);
//   if (to.matched.some(item => item.meta.needLogin)) {   // 有必须登录的字段
//     if (to.path == '/logins') {
//       next()
//     } else {
//       next('/logins')
//     }
//   } else {
//     next()
//   }

// })

// export default router
